import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import 'package:infinite_scroll_pagination/infinite_scroll_pagination.dart';
import 'package:pornhub_app/assets/assets.dart';
import 'package:pornhub_app/components/image_view.dart';
import 'package:pornhub_app/components/base_refresh/base_refresh_widget.dart';
import 'package:pornhub_app/components/no_more/no_data.dart';

import '../../../assets/styles.dart';
import '../../../model/mine/group_members_model.dart';
import '../../../utils/color.dart';
import 'group_members_success_controller.dart';

class GroupBuyMembersSuccessPage
    extends GetView<GroupMembersSuccessController> {
  const GroupBuyMembersSuccessPage({super.key});

  @override
  Widget build(BuildContext context) {
    final bgColor = Styles.color.bgColor;

    return Scaffold(
      backgroundColor: bgColor,
      appBar: AppBar(
        backgroundColor: Colors.transparent,
        shadowColor: Colors.transparent,
        iconTheme: const IconThemeData(color: Colors.white),
        title: Text("拼团记录",
            textAlign: TextAlign.center,
            style: TextStyle(
              color: COLOR.hexColor('#ffffff'),
              fontSize: 16.sp,
              fontWeight: FontWeight.w600,
            )),
        centerTitle: true,
      ),
      body: _buildContent(),
    );
  }

  Widget _buildContent() {
    return BaseRefreshWidget(controller,
        child: PagedListView(
            padding: EdgeInsets.symmetric(vertical: 15.w),
            pagingController: controller.pagingController,
            builderDelegate: PagedChildBuilderDelegate<GroupMembersModel>(
                firstPageProgressIndicatorBuilder: (context) =>
                    const SizedBox.shrink(),
                newPageProgressIndicatorBuilder: (context) =>
                    const SizedBox.shrink(),
                noMoreItemsIndicatorBuilder: (context) =>
                    const SizedBox.shrink(),
                noItemsFoundIndicatorBuilder: (context) => const NoData(),
                itemBuilder: (context, item, index) => _buildImgText(item))));
  }

  Widget _buildImgText(GroupMembersModel model) {
    return Column(
      children: [
        Container(
          margin: EdgeInsets.symmetric(horizontal: 10.w),
          width: double.infinity,
          height: 130.w,
          child: Flex(
            direction: Axis.horizontal,
            children: [
              AspectRatio(
                aspectRatio: 107 / 130,
                child: ClipRRect(
                  borderRadius: const BorderRadius.all(Radius.circular(5)),
                  child: ImageView(src: model.coverImg ?? ''),
                ),
              ),
              Padding(padding: EdgeInsets.only(left: 8.w)),
              Expanded(
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Flex(
                      direction: Axis.horizontal,
                      children: [
                        Container(
                          width: 45.w,
                          height: 21.w,
                          decoration: BoxDecoration(
                            color: COLOR.hexColor('#F52443'),
                            borderRadius: BorderRadius.circular(4),
                          ),
                          child: Align(
                            alignment: Alignment.center,
                            child: Text(
                              '${model.limitGroup}人团',
                              style: TextStyle(
                                  color: COLOR.hexColor('#ffffff'),
                                  fontSize: 12.w,
                                  fontWeight: FontWeight.w400),
                            ),
                          ),
                        ),
                        Expanded(child: Container()),
                        SizedBox(
                          height: 21.w,
                          width: 90.w,
                          // width: double.infinity,
                          child: ListView.builder(
                            physics: const NeverScrollableScrollPhysics(),
                            shrinkWrap: true,
                            scrollDirection: Axis.horizontal,
                            itemCount: model.participants?.length,
                            itemBuilder: (context, indexs) {
                              List<Participants>? participants =
                                  model.participants ?? [];
                              return participants.isEmpty
                                  ? const SizedBox.shrink()
                                  : _buildUserHead(
                                      participants[indexs], indexs);
                            },
                          ),
                        ),
                        Text(
                          "已成团",
                          style: TextStyle(
                            color: COLOR.hexColor("#F52443"),
                            fontSize: 12.w,
                            fontWeight: FontWeight.w600,
                          ),
                        ),
                      ],
                    ),
                    Padding(padding: EdgeInsets.only(top: 15.w)),
                    Text(
                      "${model.info}",
                      style: TextStyle(
                        color: COLOR.hexColor("#ffffff"),
                        fontSize: 12.w,
                        fontWeight: FontWeight.w600,
                      ),
                    ),
                    Expanded(child: Container()),
                    Container(
                      width: 123.w,
                      height: 34.w,
                      decoration: BoxDecoration(
                        color: COLOR.hexColor('#FFE2E6'),
                        borderRadius: BorderRadius.circular(6),
                      ),
                      child: Align(
                        alignment: Alignment.center,
                        child: Text(
                          "已成功拼团",
                          style: TextStyle(
                            color: COLOR.hexColor("#FF415D"),
                            fontSize: 12.w,
                            fontWeight: FontWeight.w600,
                          ),
                        ),
                      ),
                    ),
                  ],
                ),
              ),
            ],
          ),
        ),
        Container(
          margin: EdgeInsets.symmetric(vertical: 20.w),
          child: SizedBox(
            width: double.infinity,
            height: 4.w,
            child: Container(
              color: COLOR.hexColor("#181818"),
            ),
          ),
        )
      ],
    );
  }

  Widget _buildUserHead(Participants? participants, int index) {
    double offset = index * -8;
    return Transform.translate(
      offset: Offset(offset, 0), // X轴偏移
      child: ImageView(
        src: '${participants?.logo}',
        width: 21.w,
        height: 21.w,
        fit: BoxFit.cover,
        borderRadius: BorderRadius.circular(20.w),
        defaultPlace: Assets.avatarplaceholer,
      ),
    );
  }
}
